<!--
 * @Descripttion: 说明
 * @version: V1.0
 * @Author: aqiang
 * @Date: 2024-01-04 10:46:41
 * @LastEditTime: 2024-01-04 10:46:41
-->
<template>
  <div style="height:100%;width:100%;position:relative;">
    <div class="pagetop">
      <div class="top-title">快速查询</div>
      <el-input v-model="txtsearch" placeholder="申请项目代码" @keyup.enter.native="filterQuery" style="width:240px"></el-input>
      <div class="top-button">
        <el-button @click="btnQuery" icon="el-icon-search" type="primary" v-has="'PINQUERY'"
          :disabled="bChangeFlag">查询</el-button>
        <el-button @click="btnAdd" icon="el-icon-plus" v-has="'PADD'" :disabled="bChangeFlag">新增</el-button>
        <el-button @click="btnDel" icon="el-icon-delete" v-has="'PDELETE'" :disabled="bChangeFlag">删除</el-button>
        <el-button @click="btnSave" icon="el-icon-document" v-has="'PMODIFY'" :disabled="!bChangeFlag">保存</el-button>
        <el-button @click="btnClear" icon="el-icon-close" :disabled="!bChangeFlag">取消</el-button>
      </div>
    </div>
    <div class="pagecenter">
      <rm-layout-right splitcolor="#DoderBlue" movingcolor="#CCFFFF" :splitwidth="5" :fixsize="780" :canDrag="false">
        <template v-slot:fix>
          <div v-loading="bPageInitLoading" element-loading-spinner="el-icon-loading"
            element-loading-background="rgba(0, 0, 0, 0.8)" style="height:100%">
            <el-tabs v-model="activeTabName" @tab-click="HandleClick" style="height:100%;" type="border-card" ref="tabs">
              <el-tab-pane label="基本信息" name="baseinfo">
                <rm-layout-top splitcolor="#DoderBlue" movingcolor="#CCFFFF" :splitwidth="5" :fixsize="38"
                  :canDrag="false">
                  <template v-slot:fix>
                    <div style="height:38px;border:1px solid #CCC">
                      <el-form :label-position="labelPosition" label-width="80px" :model="editData">
                        <table class="table1style" style="width:100%;font-size:12px">
                          <tr>
                            <td align="right" style="color:#F56C6C;font-weight:600">申请项目代码</td>
                            <td>
                              <rm-ddl-common ref="input0" @change="HasChange" datatype="reqitem" dataname="申请项目"
                                v-model="editData.req_itemcode" :readonly="actionindex == 'M'"
                                @keyup.enter.native="NextFocus(0)" width="170px"></rm-ddl-common>
                            </td>
                            <td align="right" style="color:#F56C6C;font-weight:600">
                              测试方法
                            </td>
                            <td>
                              <el-select v-model="editData.genetestmethodno" ref="input1"
                                @keyup.enter.native="NextFocus(1)" @change="HasChange" style="width:140px">
                                <el-option :key="index" :label="item.label" :value="item.value"
                                  v-for="(item, index) in geneMethodNoOption" clearable></el-option>
                              </el-select>
                            </td>
                            <td align="right">默认阴性结果</td>
                            <td>
                              <!-- @input="HasChange" -->
                              <el-input v-model="editData.defaultnegresult" @click.native="openDlg('默认阴性结果')"
                                style="width:130px" ref="input2" readonly></el-input>
                            </td>
                          </tr>
                        </table>
                      </el-form>
                    </div>
                  </template>
                  <div style="height:100% ;width:100%;background-color:#ddccbb;" class="detailxTable">
                    <vxe-table :data="locusData" :loading="bLoading" :keyboard-config="selKeyConfig"
                      :keyboard-local-config="selKeyLocalConfig" :select-config="selectConfig"
                      :sort-config="{ trigger: 'cell' }" :edit-config="{
                        trigger: 'click',
                        mode: 'cell',
                        showStatus: true,
                        activeMethod: ActiveMethod,
                        showIcon: false,
                      }" border fit height="auto" header-align="center" highlight-current-row highlight-hover-row
                      highlight-hover-column ref="rXTable" resizable size="mini" stripe :row-class-name="rRowClassName"
                      :cell-class-name="rCellClassName" :edit-closed="rEditClosed" :mouse-config="{ selected: true }"
                      show-header-overflow="tooltip" show-overflow="tooltip" :key="basekey"
                      @cell-dblclick="rCellDblClick">
                      <vxe-table-column field="rpt_itemname" title="对应点位(双击弹窗)" width="210"
                        :edit-render="{ name: 'input', autoselect: true, }">
                        <template v-slot:header="{ column }">
                          <span style="color:#F56C6C;font-weight:600">对应点位(双击弹窗)</span>
                        </template>
                        <template v-slot:edit="{ row }">
                          <el-input v-model="row.rpt_itemname" style="width:100%" placeholder=""
                            @keyup.space.native="popGetRow(row);" @dblclick.native="popGetRow(row)" readonly>
                          </el-input>
                        </template>
                      </vxe-table-column>
                      <vxe-table-column field="rowno" title="行" width="40" align="center"
                        :edit-render="{ name: 'input', autoselect: true, events: { change: HasChange }, }">
                      </vxe-table-column>
                      <vxe-table-column field="colno" align="center" title="列" width="40"
                        :edit-render="{ name: 'input', autoselect: true, events: { change: HasChange }, }">
                      </vxe-table-column>
                      <vxe-table-column field="locus_exon" title="所属外显子" width="140"
                        :edit-render="{ name: 'input', autoselect: true, events: { change: HasChange }, }"></vxe-table-column>
                      <vxe-table-column field="isdefault" title="默认" width="40" align="center">
                        <template v-slot="{ row }">
                          <el-checkbox v-model="row.isdefault" @change="HasChange" true-label="1" false-label="0"
                            :disabled="bEisdefault"></el-checkbox>
                        </template>
                      </vxe-table-column>
                      <vxe-table-column field="locus_desc" title="描述" width="180"
                        :edit-render="{ name: 'input', autoselect: true, events: { change: HasChange }, }"><template
                          v-slot:header="{ column }">
                          <span>描述(双击开窗)</span>
                        </template></vxe-table-column>
                      <vxe-table-column field="item_level" title="高危低危分类" width="110" :edit-render="{
                        name: 'select',
                        options: itemLvOptions,
                        events: { change: (row, val) => { row.row.item_level = val.target.value; HasChange() } },
                      }" align="center"> </vxe-table-column>
                      <template v-slot:fix>
                        <div style="font-size:17px;padding:3px;background-color:#fff;text-align:center;font-weight:bold">
                          <el-button @click="btnDetailAdd()" class="el-button--310">新增明细</el-button>
                          <el-button @click="btnDetailDel()" class="el-button--310">删除明细</el-button>
                        </div>
                      </template>
                    </vxe-table>
                  </div>
                </rm-layout-top>
              </el-tab-pane>
              <el-tab-pane label="基因位点组合" name="locusgroup">
                <div style="height:100% ;width:100%;background-color:#ddccbb;" class="detailxTable">
                  <vxe-table :data="groupData" :loading="bLoading" :keyboard-config="selKeyConfig"
                    :keyboard-local-config="selKeyLocalConfig" :select-config="selectConfig"
                    :sort-config="{ trigger: 'cell' }" :edit-config="{
                      trigger: 'click',
                      mode: 'cell',
                      showStatus: true,
                      activeMethod: ActiveMethod,
                      showIcon: false,
                    }" border fit height="100%" header-align="center" highlight-current-row highlight-hover-row
                    highlight-hover-column ref="groupXTable" resizable size="mini" stripe :row-class-name="rRowClassName"
                    :cell-class-name="rCellClassName" :edit-closed="rEditClosed" :mouse-config="{ selected: true }"
                    show-header-overflow="tooltip" show-overflow="tooltip" :key="groupkey"
                    @current-change="currentGChange" @cell-dblclick="groupCellDblClick">
                    <vxe-table-column field="locusgroupname" title="组合名称" width="100"
                      :edit-render="{ name: 'input', autoselect: true, events: { change: HasChange }, }">
                    </vxe-table-column>
                    <vxe-table-column field="seqno" title="序号" width="50"
                      :edit-render="{ name: 'input', autoselect: true, events: { change: HasChange }, }">
                    </vxe-table-column>
                    <vxe-table-column field="locus_desc" title="结果描述" width="180" header-align="center" align="left"
                      :edit-render="{ name: 'input', autoselect: true, events: { change: HasChange }, }"> <template
                        v-slot:header="{ column }">
                        <span>结果描述(双击开窗)</span>
                      </template></vxe-table-column>
                    <vxe-table-column field="rpt_itemcodes" title="对应点位组合" width="350">
                      <template v-slot:header="{ column }">
                        <span style="color:#F56C6C;">对应点位组合</span>
                      </template>
                    </vxe-table-column>
                    <template v-slot:fix>
                      <div style="width:100%;height:20px">
                        <el-alert title="提示：点击添加点位组合。" type="success" effect="dark"
                          style="width:100%;float:right;height:17px" :closable="false">
                        </el-alert>
                      </div>
                      <div style="background:white;width:100%;height:335px">
                        <div class="shelf-detail">
                          <div v-for="row in sel.rownumber" :key="'row' + row"
                            :class="['shelf-row', row == 1 ? 'first-row' : '']">
                            <div class="nofirst-row">
                              <template v-if="rptitemsarr.length > 0">
                                <div
                                  :class="['shelf-position', rptitemsarr[row - 1][col - 1].inuse == '2' ? rptitemsarr[row - 1][col - 1].isselected ? 'shelf-inuse-focus' :
                                    'shelf-inuse' : rptitemsarr[row - 1][col - 1].isselected ? 'shelf-unuse-focus' : '']"
                                  v-for="col in sel.colnumber" :key="'col' + col" @mousedown="MouseDown(row, col, $event)">
                                  <div
                                    :class="[rptitemsarr[row - 1][col - 1].isoccupy ? rptitemsarr[row - 1][col - 1].isselected ? 'radius-color-inuse' : 'radius-color-unuse' : '']">
                                  </div>
                                  <div :v-show="rptitemsarr[row - 1][col - 1].isoccupy == true"
                                    :class="[rptitemsarr[row - 1][col - 1].isselected ? 'radius-rptname-inuse' : 'radius-rptname-unuse']">
                                    {{ rptitemsarr[row - 1][col - 1].rpt_itemcode }}</div>
                                </div>
                              </template>
                              <template v-else>
                                <div class="shelf-position" v-for="col in sel.colnumber" :key="'col' + col"></div>
                              </template>
                            </div>
                          </div>
                        </div>
                      </div>
                      <div style="font-size:17px;padding:3px;background-color:#fff;text-align:center;font-weight:bold">
                        <el-button @click="btnGroupAdd()" class="el-button--310">新增组合</el-button>
                        <el-button @click="btnGroupDel()" class="el-button--310">删除组合</el-button>
                      </div>
                    </template>
                  </vxe-table>
                </div>
              </el-tab-pane>
            </el-tabs>
          </div>
        </template>
        <div style="height:100%">
          <vxe-table :data.sync="showLXTableData" :loading="bLoading" :keyboard-local-config="keyLocalConfig"
            :row-class-name="lRowClassName" :select-config="selectConfig" :sort-config="{ trigger: 'cell' }"
            :edit-config="{ trigger: 'click', mode: 'cell', showStatus: true, showIcon: false, }"
            @current-change="currentChangeEvent" border fit height="auto" header-align="center" highlight-current-row
            highlight-hover-row highlight-hover-column ref="lXTable" resizable size="mini" stripe
            show-header-overflow="tooltip" show-overflow="tooltip">
            <vxe-table-column field="req_itemname" title="申请项目" width="250"></vxe-table-column>
            <vxe-table-column field="genetestmethodno" title="测试方法" width="140" align="center"></vxe-table-column>
            <vxe-table-column field="defaultnegresult" title="默认阴性结果" width="260" align="left"
              header-align="center"></vxe-table-column>
          </vxe-table>
        </div>
      </rm-layout-right>
      <el-dialog v-el-drag-dialog :append-to-body="true" :close-on-click-modal="false" title="基因项目"
        :visible.sync="bGeneItemDlg" v-if="bGeneItemDlg" :keyboard-local-config="keyLocalConfig">
        <rm-chkboxSelect2 :initgermflag="6" :germmode="true"
          @cancel="bGeneItemDlg = false, linkshow = true, $refs.rXTable.setActiveCell($refs.rXTable.getCurrentRow(), 'rpt_itemname')"
          :rptunitdisabled="true" @selitems="detailAddItems" ref="rptdialog"></rm-chkboxSelect2>
      </el-dialog>
      <el-dialog v-el-drag-dialog :append-to-body="true" :close-on-click-modal="false" :title="txtTitle"
        :visible.sync="btxtDlg" :keyboard-local-config="keyLocalConfig">
        <!-- v-if="bGeneItemDlg"  -->
        <div class="txtDlg">
          <el-input ref="reftxt" type="textarea" placeholder="请输入内容" v-model="txtresult"
            style="height: 250px;"></el-input>
        </div>
        <div style="font-size:12px;padding: 0 0 0 5px; text-align: right;">
          <el-button @click="saveDlg">确定</el-button>
        </div>
        <!-- <rm-chkboxSelect2 :initgermflag="6" :germmode="true" @cancel="btxtDlg=false,linkshow = true,$refs.rXTable.setActiveCell($refs.rXTable.getCurrentRow(), 'rpt_itemname')" :rptunitdisabled="true" @selitems="detailAddItems" ref="rptdialog"></rm-chkboxSelect2> -->

      </el-dialog>
    </div>
  </div>
</template>

<script type="text/javascript">
import XE from "xe-utils";
export default {
  name: "LIS11C",
  data() {
    return {
      txtTitle: "文字编辑",
      txtresult: "", //文字结果
      btxtDlg: false,
      groupData: [],
      sel: {},
      rptitemsarr: [],
      basekey: 0,
      groupkey: 0,
      geneMethodNoOption: [], //测试方法
      activeTabName: "baseinfo", //默认tab页
      txtsearch: "",
      actionindex: "M",
      labelPosition: "right",
      bLoading: false,
      bChangeFlag: false,
      bGeneItemDlg: false,
      bPageInitLoading: false,
      selKeyConfig: {
        isDel: true,
        isTab: true,
        isEdit: true,
      },
      selKeyLocalConfig: {
        isArrow: true,
      },
      keyLocalConfig: {
        isDel: true,
        isTab: true,
        isEdit: true,
        isArrow: true,
      },
      editData: {
        req_itemcode: "",
        defaultnegresult: "",
        genetestmethodno: "",
      },
      selectConfig: { tigger: "row" },
      labMedRow: {},
      tempmed: {},
      tmpeditData: {},
      selrow: [],
      AddData: [], //新增数据 用于变色
      ModData: [], //修改数据 用于变色
      lXTableData: [],
      locusData: [],
      showLXTableData: [],
      bEisdefault: false,
      itemLvOptions: [
        {
          label: "",
          value: "0",
        },
        {
          label: "低危",
          value: "2",
        },
        {
          label: "高危",
          value: "1",
        },
      ],
    };
  },
  created() {
    this.getOption();
    this.btnQuery();
  },
  computed: {
    //排序
    autoSeq() {
      let len = this.$refs.groupXTable.tableData.length;
      return (len + 1) * 10;
    },
  },
  methods: {
    rCellDblClick({ column, row }) {
      console.log("🍄🍄🍄 —— column", column.property);
      if (column.property == "locus_desc") {
        this.txtresult = row.locus_desc;
        this.txtTitle = "描述";
        this.btxtDlg = true;
        this.textfocus(15);
      }
    },
    groupCellDblClick({ column, row }) {
      if (column.property == "locus_desc") {
        this.txtresult = row.locus_desc;
        this.txtTitle = "结果描述";
        this.btxtDlg = true;
        this.textfocus(15);
      }
    },
    textfocus(ms) {
      setTimeout(() => {
        this.$refs.reftxt.focus();
      }, ms);
    },
    valid(obj, message) {
      if (XE.isUndefined(obj)) {
        return this.$message({
          message: message,
          type: "warning",
        });
      }
      if (XE.isNull(obj)) {
        return this.$message({
          message: message,
          type: "warning",
        });
      }
      if (XE.isString(obj)) {
        if (!XE.getSize(obj) > 0) {
          return this.$message({
            message: message,
            type: "warning",
          });
        }
      }
      if (XE.isDate(obj)) {
        if (obj < XE.toStringDate("2000-01-01")) {
          return this.$message({
            message: message,
            type: "warning",
          });
        }
      }
    },
    currentGChange({ row }) {
      this.currentGroupChange(row);
    },
    currentGroupChange(row) {
      this.rptitemsarr.forEach((ex) => {
        ex.forEach((ey) => {
          ey.isselected = false;
        });
      });
      if (row && row.rpt_itemcodes && row.rpt_itemcodes.length > 0) {
        var groupdt = row.rpt_itemcodes.split(",");
        this.rptitemsarr.forEach((ex) => {
          ex.forEach((ey) => {
            groupdt.forEach((r) => {
              if (ey.rpt_itemcode == r) {
                ey.isselected = true;
              }
            });
          });
        });
      }
    },
    MouseDown(row, col, ev) {
      var currentrow = this.$refs.groupXTable.getCurrentRow();
      console.log("🍄🍄🍄 —— currentrow", currentrow);
      if (currentrow) {
        if (this.rptitemsarr[row - 1][col - 1].isoccupy) {
          this.rptitemsarr[row - 1][col - 1].isselected = !this.rptitemsarr[row - 1][col - 1].isselected;
          var text = "";
          this.rptitemsarr.forEach((ex) => {
            ex.forEach((ey) => {
              if (ey.isselected) {
                text += ey.rpt_itemcode + ",";
              }
            });
          });
          if (text.length > 0) {
            currentrow.rpt_itemcodes = text.substring(0, text.length - 1);
          } else currentrow.rpt_itemcodes = "";
        }
        this.bChangeFlag = true;
      } else {
        this.$message({
          type: "info",
          message: "请先选择一条组合明细。",
        });
      }
    },
    detailAddItems(rptitemcodeinfos) {
      var ishave = false;
      var datarecord = this.$refs.rXTable.getTableData().fullData;
      let initdata = [];
      for (var i = 0; i < rptitemcodeinfos.length; i++) {
        if (datarecord.length > 0) {
          try {
            datarecord.forEach((item) => {
              if (item.rpt_itemcode == rptitemcodeinfos[i].rpt_itemcode) {
                ishave = true;
                throw Error();
              } else {
                ishave = false;
              }
            });
          } catch (e) { }
        }
        if (ishave) {
          continue;
        }
        let addrecord = {
          req_itemcode: this.editData.req_itemcode, //申请项目diamante
          rpt_itemcode: rptitemcodeinfos[i].rpt_itemcode, //报告项目代码
          rpt_itemname: rptitemcodeinfos[i].rpt_itemname, //报告项目代码
          rowno: "",
          colno: "",
          locus_exon: "",
          locus_desc: "",
          isdefault: "0",
        };
        initdata.push(addrecord);
      }
      this.$refs.rXTable.insert(initdata);
      this.bGeneItemDlg = false;
    },
    //----------------- 查询类 ----------------- //
    openDlg(txtTitle) {
      this.txtresult = "";
      this.txtTitle = txtTitle;
      if (txtTitle == "默认阴性结果") {
        this.txtresult = this.editData.defaultnegresult;
      }
      this.btxtDlg = true;
      this.textfocus(15);
    },
    saveDlg() {
      if (this.txtTitle == "默认阴性结果") {
        this.editData.defaultnegresult = this.txtresult;
      } else if (this.txtTitle == "描述") {
        var rrow = this.$refs.rXTable.getCurrentRow();
        if (rrow) {
          rrow.locus_desc = this.txtresult;
        }
      } else if (this.txtTitle == "结果描述") {
        var grouprow = this.$refs.groupXTable.getCurrentRow();
        if (grouprow) {
          grouprow.locus_desc = this.txtresult;
        }
      }
      this.bChangeFlag = true;
      this.btxtDlg = false;
    },
    //主表查询
    filterQuery() {
      let filterName = this.txtsearch.trim();
      if (filterName) {
        let rest = this.lXTableData.filter((item) => {
          return item.req_itemname.toUpperCase().indexOf(filterName.toUpperCase()) > -1 || (item.genetestmethodno ? item.genetestmethodno.toUpperCase().indexOf(filterName.toUpperCase()) > -1 : false) || (item.defaultnegresult ? item.defaultnegresult.toUpperCase().indexOf(filterName.toUpperCase()) > -1 : false);
        });
        this.showLXTableData = rest;
      } else {
        this.showLXTableData = this.lXTableData;
      }
      let row = this.showLXTableData[0];
      if (row) {
        this.HightLightRow(row);
      } else {
        this.HightLightRow(false);
      }
    },
    async getOption() {
      try {
        const res = await this.$tool.request({
          url: "LIS/LIS1/LIS11C",
          method: "post",
          data: {
            action: "getOption",
          },
        });
        if (res) {
          this.geneMethodNoOption = res;
        } else {
          this.geneMethodNoOption = [];
        }
      } catch (e) {
        this.$message.warning(e);
      }
    },
    HandleClick(tab, event) {
      if (tab.label == "基本信息") {
        var grouprec = this.$refs.groupXTable.getRecordset();
        if (grouprec.insertRecords.length > 0 || grouprec.removeRecords.length > 0 || grouprec.updateRecords.length > 0) {
          this.$message({
            type: "info",
            message: "请您先保存基因位点组合后再选择基本信息。",
          });
          setTimeout(() => {
            this.activeTabName = "locusgroup";
          }, 50);
        } else {
          this.basekey++;
        }
      } else if (tab.label == "基因位点组合") {
        var baserec = this.$refs.rXTable.getRecordset();
        if (baserec.insertRecords.length > 0 || baserec.removeRecords.length > 0 || baserec.updateRecords.length > 0) {
          this.$message({
            type: "info",
            message: "请您先保存基本信息后再选择基因位点组合。",
          });
          setTimeout(() => {
            this.activeTabName = "baseinfo";
          }, 50);
        } else {
          this.groupkey++;
          var row = this.$refs.lXTable.getCurrentRow();
          this.queryrptitems(row); //实时查一下
        }
      }
    },
    queryrptitems(row) {
      this.groupkey++;
      this.rptitemsarr = [];
      this.sel = {
        rownumber: 0,
        colnumber: 0,
      };
      this.$tool
        .request({
          url: "LIS/LIS1/LIS11C",
          method: "post",
          data: {
            action: "queryrptitems",
            req_itemcode: row.req_itemcode,
          },
        })
        .then((res) => {
          if (res.dt.length > 0 && res.maxrow > 0 && res.maxcol > 0) {
            // if (res.RShelf.Data.length > 0) {
            var rownumber = res.maxrow;
            var colnumber = res.maxcol;
            var rptitemsarr = new Array(rownumber);
            for (var m = 0; m < rownumber; m++) {
              rptitemsarr[m] = new Array(colnumber);
              for (var n = 0; n < colnumber; n++) {
                rptitemsarr[m][n] = {
                  rpt_itemcode: "",
                  isoccupy: false,
                  isselected: false,
                };
              }
            }
            res.dt.forEach((e) => {
              rptitemsarr[e.rowno - 1][e.colno - 1] = {
                rpt_itemcode: e.rpt_itemcode,
                isoccupy: true,
                isselected: false,
              };
            });
            this.rptitemsarr = rptitemsarr;
            this.sel = {
              rownumber: rownumber,
              colnumber: colnumber,
            };
            if (this.$refs.groupXTable.tableData.length > 0) {
              this.$refs.groupXTable.setCurrentRow(this.groupData[0]);
              if (this.groupData[0] && this.groupData[0].rpt_itemcodes && this.groupData[0].rpt_itemcodes.length > 0) {
                var groupdt = this.groupData[0].rpt_itemcodes.split(",");
                this.rptitemsarr.forEach((ex) => {
                  ex.forEach((ey) => {
                    groupdt.forEach((r) => {
                      if (ey.rpt_itemcode == r) {
                        ey.isselected = true;
                      }
                    });
                  });
                });
              }
            }
          }
        })
        .catch((e) => {
          this.ErrorCatch(e, "", "error");
        });
    },
    btnQuery() {
      this.AddData = [];
      this.ModData = [];
      this.bLoading = true;
      this.$tool
        .request({
          url: "LIS/LIS1/LIS11C",
          method: "post",
          data: {
            action: "lab_gene_reqitem_query",
          },
        })
        .then((res) => {
          this.lXTableData = res.data;
          this.filterQuery();
          if (this.lXTableData.length == 0) this.actionindex = "A";
          this.bLoading = false;
        })
        .catch((e) => {
          this.ErrorCatch(e, "", "error");
          this.bLoading = false;
        });
    },
    //明细查询 -- 主表，子表
    async detailQuery(row) {
      try {
        this.selrow = row;
        this.actionindex = "M";
        this.bPageInitLoading = true;
        const res = await this.$tool.request({
          url: "LIS/LIS1/LIS11C",
          method: "post",
          data: {
            action: "lab_gene_reqitem_query_detail",
            req_itemcode: row.req_itemcode,
          },
        });
        if (res.lab_gene_reqitem && res.lab_gene_reqitem.length > 0) {
          this.editData = res.lab_gene_reqitem[0];
          this.locusData = res.lab_gene_locus;
          this.groupData = res.lab_gene_locusgroup;
        }
        this.tmpeditData = XE.clone(this.editData, true);
        this.bPageInitLoading = false;
        this.queryrptitems(row);
      } catch (e) {
        this.ErrorCatch(e, "", "error");
        this.bPageInitLoading = false;
      }
    },
    //----------------- 按钮类 -----------------//
    //新增
    btnAdd() {
      this.bChangeFlag = true;
      this.activeTabName = "baseinfo";
      this.actionindex = "A";
      this.editData = {
        req_itemcode: "",
        genetestmethodno: "",
        defaultnegresult: "",
      };
      this.locusData = [];
      this.$refs.input0.focus();
    },
    btnGroupAdd() {
      this.$refs.groupXTable.insertAt(
        {
          req_itemcode: this.editData.req_itemcode,
          seqno: this.autoSeq,
          locusgroupname: "",
          rpt_itemcodes: "",
          locus_desc: "",
        },
        -1
      );
      this.$refs.groupXTable.setCurrentRow(this.$refs.groupXTable.tableData[this.$refs.groupXTable.tableData.length - 1]);
      this.$refs.groupXTable.setActiveRow(this.$refs.groupXTable.tableData[this.$refs.groupXTable.tableData.length - 1], "locusgroupname");
      this.$refs.groupXTable.scrollToRow(this.$refs.groupXTable.tableData[this.$refs.groupXTable.tableData.length - 1]);
      this.rptitemsarr.forEach((ex) => {
        ex.forEach((ey) => {
          ey.isselected = false;
        });
      });
      this.bChangeFlag = true;
    },
    btnGroupDel() {
      try {
        var delrow = this.$refs.groupXTable.getCurrentRow();
        if (delrow) {
          var alld = this.$refs.groupXTable.tableData;
          var rowindex = alld.indexOf(delrow);
          this.$refs.groupXTable.remove(delrow);
          let havedata = this.$refs.groupXTable.tableData;
          if (havedata.length > 0) {
            if (rowindex >= havedata.length) rowindex = havedata.length - 1;
            let selectrow = havedata[rowindex];
            this.$refs.groupXTable.setCurrentRow(selectrow);
            this.currentGroupChange(selectrow);
          } else {
            this.$refs.groupXTable.setCurrentRow(null);
            this.rptitemsarr.forEach((ex) => {
              ex.forEach((ey) => {
                ey.isselected = false;
              });
            });
          }
          this.bChangeFlag = true;
        }
      } catch (e) {
        console.log("error", e);
      }
    },
    btnDetailAdd() {
      this.bGeneItemDlg = true;
      this.$refs.rXTable.setActiveRow(this.$refs.rXTable.tableData[this.$refs.rXTable.tableData.length - 1], "rpt_itemcode");
      this.$refs.rXTable.scrollToRow(this.$refs.rXTable.tableData[this.$refs.rXTable.tableData.length - 1]);
      this.bChangeFlag = true;
    },
    async btnDetailDel() {
      try {
        var delrow = this.$refs.rXTable.getCurrentRow();
        if (delrow) {
          const res = await this.$tool.request({
            url: "LIS/LIS1/LIS11C",
            method: "post",
            data: {
              action: "checkdel",
              rpt_itemcode: delrow.rpt_itemcode,
            },
          });
          if (res) {
            var alld = this.$refs.rXTable.tableData;
            var rowindex = alld.indexOf(delrow);
            this.$refs.rXTable.remove(delrow);
            let havedata = this.$refs.rXTable.tableData;
            if (havedata.length > 0) {
              if (rowindex >= havedata.length) rowindex = havedata.length - 1;
              let selectrow = havedata[rowindex];
              this.$refs.rXTable.setCurrentRow(selectrow);
            } else {
              this.$refs.rXTable.setCurrentRow(null);
            }
            this.bChangeFlag = true;
          } else {
            this.$message.warning("项目 " + delrow.rpt_itemcode + " 在组合内已使用，不允许删除。");
          }
        }
      } catch (e) {
        console.log("error", e);
      }
    },
    //删除 -- 弹窗提示
    btnDel() {
      var delrow = this.$refs.lXTable.getCurrentRow();
      this.$confirm('确定删除申请项目代码为<b style="color:red">' + delrow.req_itemname + "</b>的记录吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        dangerouslyUseHTMLString: true,
        type: "warning",
      })
        .then(() => {
          this.actionindex = "D";
          this.confirmDel();
        })
        .catch((e) => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    //删除 -- 确认删除
    async confirmDel() {
      try {
        var delrow = this.$refs.lXTable.getCurrentRow();
        if (delrow) {
          var alld = this.$refs.lXTable.tableData;
          var rowindex = alld.indexOf(delrow);
          await this.btnSave().then(() => {
            this.$refs.lXTable.remove(delrow);
            this.lXTableData.splice(rowindex, 1);
            let havedata = this.$refs.lXTable.tableData;
            if (havedata.length > 0) {
              if (rowindex >= havedata.length) rowindex = havedata.length - 1;
              let selectrow = havedata[rowindex];
              this.HightLightRow(selectrow);
            } else {
              this.HightLightRow(false);
            }
          });
        }
      } catch (e) {
        this.ErrorCatch(e, "", "error");
      }
    },
    //取消 -- 取消操作，数据还原
    btnClear() {
      this.$confirm("您确定要取消这次改动吗？", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.bChangeFlag = false;
          this.activeTabName = "baseinfo";
          this.detailQuery(this.selrow);
        })
        .catch((e) => { });
    },
    //保存 -- 保存新增，修改，删除主表: lab_gene_reqitem 子表: lab_gene_reqitemdetail 操作//
    async btnSave() {
      try {
        if (!this.editData.req_itemcode) {
          this.$alert("申请项目代码不能为空！");
          this.$refs.input0.focus();
          return false;
        }
        if (!this.editData.genetestmethodno) {
          this.$alert("测试方法不能为空！");
          this.$refs.input1.focus();
          return false;
        }
        var record = this.$refs.rXTable.tableData;
        var arrstr = "";
        for (let i = 0, len = record.length; i < len; i++) {
          var rmsg = this.valid(record[i].rowno, "提示：第" + (i + 1) + "行 行号 必须填写！");
          if (rmsg) return rmsg;
          var cmsg = this.valid(record[i].colno, "提示：第" + (i + 1) + "行 列号 必须填写！");
          if (cmsg) return cmsg;
          arrstr += "行:" + record[i].rowno + " 列:" + record[i].colno + ",";
        }
        if (arrstr.length > 0) {
          var arr = arrstr.split(",");
          for (var i = 0; i < arr.length; i++) {
            if (arrstr.replace(arr[i] + ",", "").indexOf(arr[i] + ",") > -1 && arr[i].length > 0) {
              var checkmsg = "提示：存在重复位置,请修改。重复位置：" + arr[i];
              this.$message({
                message: checkmsg,
                type: "warning",
              });
              return false;
            }
          }
        }
        let data = this.$refs.rXTable.getTableData().fullData;
        for (let i = 0, len = data.length; i < len; i++) {
          data[i].req_itemcode = this.editData.req_itemcode; //修正新增明细后，再次修改申请项目代码导致明细项保存错位。
        }
        let groupdata = this.$refs.groupXTable.getTableData().fullData;
        groupdata.sort((a, b) => {
          return a.seqno - b.seqno;
        });
        for (let i = 0, len = groupdata.length; i < len; i++) {
          let tempseq = (i + 1) * 10;
          if (tempseq !== groupdata[i].seqno) {
            groupdata[i].seqno = tempseq;
          }
        }
        const res = await this.$tool.request({
          url: "LIS/LIS1/LIS11C",
          method: "post",
          timeout: 600000,
          data: {
            action: "lab_gene_reqitem_query_save",
            utype: this.actionindex,
            oldinfo: this.tmpeditData,
            newinfo: this.editData,
            lab_gene_locus: this.$refs.rXTable.getRecordset(),
            lab_gene_locusgroup: this.$refs.groupXTable.getRecordset(),
          },
        });
        if (res.errcode == "1") {
          this.$message.success("保存成功！");
          this.bChangeFlag = false;
          if (this.actionindex == "A") {
            if (this.AddData.indexOf(this.editData.req_itemcode) == -1) this.AddData.push(this.editData.req_itemcode);
            this.$refs.lXTable.insert(this.editData).then(({ row }) => {
              this.HightLightRow(row);
              this.lXTableData.push(row);
            });
          } else if (this.actionindex == "M") {
            if (this.ModData.indexOf(this.editData.req_itemcode) == -1) this.ModData.push(this.editData.req_itemcode);
            await this.SetToTable(this.editData).then((row) => {
              this.HightLightRow(row);
            });
          } else {
            this.actionindex = "M";
          }
        } else {
          this.ErrorCatch(res.errmsg, "保存失败:", "error");
        }
      } catch (e) {
        this.ErrorCatch(e, "", "error");
      }
    },
    ErrorCatch(e, msg, type) {
      this.$alert(msg + e, "提示", {
        confirmButtonText: "确定",
        type: type ? type : "error",
      });
    },
    //--------------- 数据改变及其他功能 ---------------//
    //行改变事件
    async currentChangeEvent({ row }) {
      if (this.bChangeFlag) {
        this.$refs.lXTable.setCurrentRow(this.selrow);
        return false;
      } else {
        await this.detailQuery(row);
      }
    },
    //保存后不刷新左侧主表,前台赋值。
    SetToTable(obj) {
      return new Promise((s, f) => {
        this.selrow.req_itemcode = obj.req_itemcode;
        this.selrow.medgroupname = obj.medgroupname;
        this.selrow.inputcode = obj.inputcode;
        this.selrow.locus_exon = obj.locus_exon;
        this.selrow.genetestmethodno = obj.genetestmethodno;
        if (obj.groupkind == "1") {
          this.selrow.groupkind = "补充药敏";
        } else if (obj.groupkind == "9") {
          this.selrow.groupkind = "仪器转用";
        } else {
          this.selrow.groupkind = obj.groupkind;
        }
        this.selrow.defaultnegresult = obj.defaultnegresult;
        this.selrow.panelno = obj.panelno;
        s(this.selrow);
        return;
      });
    },
    // 焦点跳转
    NextFocus(index) {
      var focusIndex = index + 1;
      var that = this;
      if (index < 3) {
        setTimeout(function () {
          if (index == 2) {
            that.$refs["input" + index].blur();
          }
        }, 5);
      } else {
        //表单最后一格 回车 跳转明细表
        this.$refs.rXTable.insertAt(
          {
            req_itemcode: this.editData.req_itemcode,
            locus_exon: this.autoSeq,
            isdefault: "0",
          },
          -1
        ),
          this.$refs.rXTable.setActiveRow(this.$refs.rXTable.getTableData().fullData[this.$refs.rXTable.getTableData().fullData.length - 1], "rpt_itemcode");
        this.$refs.rXTable.scrollToRow(this.$refs.rXTable.getTableData().fullData[this.$refs.rXTable.getTableData().fullData.length - 1]);
        this.bChangeFlag = true;
      }
    },
    ActiveMethod({ row, column }) {
      return true;
    },
    //数据发生改变 -- 按钮禁用/可用切换
    HasChange() {
      this.bChangeFlag = true;
    },
    //获取 抗生素弹窗 行数据
    popGetRow(row) {
      this.tempmed = XE.clone(row.medcode);
      this.labMedRow = row;
      this.bGeneItemDlg = true;
    },
    //获取输入码
    CreateInputcode() {
      this.editData.inputcode = this.$pub.CreateInputcode(this.editData.medgroupname, this, 16);
    },
    //获取pop 组件 hidecode，hidename
    LabMedRowChange(c, v) {
      this.labMedRow.medcode = c;
      this.labMedRow.rpt_itemcode = v + "[" + c + "]";
      if (this.tempmed != this.labMedRow.medcode) {
        this.HasChange();
      }
      this.bGeneItemDlg = false;
      this.$refs.rXTable.setActiveCell(this.labMedRow, "locus_exon");
    },
    //设置高亮选中行
    async HightLightRow(row) {
      if (!!row) {
        this.$refs.lXTable.setCurrentRow(row);
        await this.detailQuery(row);
      } else {
        this.$refs.lXTable.setCurrentRow(null);
        this.editData = {};
        this.tmpeditData = {};
        this.locusData = [];
        this.groupData = [];
        this.rptitemsarr = [];
      }
    },
    rEditClosed({ row, column }) {
      if (column.property == "loadresultflag") {
        this.bChangeFlag = true;
      }
    },
    //----------------- class -----------------//
    //左侧主表 class
    lRowClassName({ row, rowIndex }) {
      if (this.AddData.indexOf(row.req_itemcode) > -1) {
        return "row-new";
      }
      if (this.ModData.indexOf(row.req_itemcode) > -1) {
        return "row-modify";
      }
    },
    //右侧子表 class
    rRowClassName({ row, rowIndex }) {
      if (this.$refs.rXTable.hasRowInsert(row)) {
        return "row-new";
      }
      if (this.$refs.rXTable.hasRowChange(row)) {
        return "row-modify";
      }
    },
    rCellClassName({ column, row }) {
      if (column.property == "req_itemcode") {
        return "col-readonly";
      }
    },
  },
};
</script>

<style scoped>
table {
  font-size: 12px;
  border-collapse: separate;
  border-spacing: 5px;
}

.top-title {
  margin: 0 3px 0 20px;
  font-size: 12px;
}

.top-button {
  right: 5px;
  position: absolute;
  top: 5px;
  display: flex;
  align-items: center;
}

.pagetop {
  width: 100%;
  height: 35px;
  display: -webkit-box;
  -webkit-box-pack: left;
  -webkit-box-align: center;
  border: 1px solid #ccc;
  position: absolute;
  z-index: 99;
}

.pagecenter {
  position: absolute;
  top: 40px;
  width: 100%;
  left: 0;
  bottom: 0px;
  overflow: auto;
}

.detailxTable {}

.detail-operation {
  display: flex;
  padding: 0px 2px 0px 5px;
  margin: 5px 0;
}

::v-deep.el-textarea__inner {
  display: block;
  resize: vertical;
  padding: 2px 4px;
}

::v-deep.el-button.is-disabled {
  border: 0px;
  color: grey;
  background-color: #e6e6e6;
  font-weight: normal;
}

::v-deeptr.vxe-body--row.row-modify {
  color: blue;
}

::v-deeptr.vxe-body--row.row-new {
  color: #cc6600;
}

::v-deep.col-readonly {
  background-color: #eeeeee;
}

::v-deep.el-checkbox__input.is-disabled+span.el-checkbox__label {
  color: #000000;
  cursor: not-allowed;
}

::v-deep.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
  border-color: #000000;
}

::v-deep.el-checkbox__input.is-disabled .el-checkbox__inner,
.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner+.el-input.is-disabled .el-input__inner {
  background-color: #ffffff !important;
}

.tableStyle tr td {
  padding: 0px 2px 0px 2px;
}

.shelf-detail {
  /* margin-left: 20px; */
  width: 100%;
  height: 100%;
  overflow: auto;
}

.shelf-row {
  height: 55px;
  text-align: center;
}

.col-title {
  display: inline-table;
  width: 19px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  font-size: 12px;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -khtml-user-select: none;
  user-select: none;
}

.nofirst-row {
  display: inline-flex;
}

.shelf-inuse-focus {
  height: 55px;
  width: 110px;
  border-style: double;
  background-color: rgb(231, 255, 233);
  margin: 0 0px;
}

.shelf-position {
  height: 55px;
  width: 110px;
  border: 1px solid #ebebeb;
  margin-right: -1px;
  margin-bottom: -1px;
  margin-left: -1px;
  margin: 0 0px;
}

.shelf-unuse-focus {
  height: 55px;
  width: 110px;
  border: 1px solid #ebebeb;
}

.shelf-inuse {
  background-color: rgb(166, 235, 173);
}

.radius-color-inuse {
  margin: 0 auto;
  height: 30px;
  width: 30px;
  background-color: rgb(60, 61, 60);
  border: 1px solid #f5f3f3;
  border-radius: 100%;
}

.radius-color-unuse {
  margin: 0 auto;
  height: 30px;
  width: 30px;
  background-color: rgb(238, 238, 238);
  border: 1px solid #f5f3f3;
  border-radius: 100%;
}

.radius-rptname-inuse {
  -webkit-user-select: none;
  margin: 0 auto;
  height: 20px;
  /* width: 30px; */
  color: rgb(60, 61, 60);
  padding-top: 7px;
  white-space: nowrap;
}

.radius-rptname-unuse {
  -webkit-user-select: none;
  margin: 0 auto;
  height: 20px;
  /* width: 30px; */
  color: rgb(118 116 116);
  padding-top: 7px;
  white-space: nowrap;
}

.txtDlg {
  margin-top: 5px;
  height: 250px;
}

::v-deep .txtDlg textarea {
  padding: 5px !important;
  height: 100%;
}</style>
